<%--
  Created by IntelliJ IDEA.
  User: Admin
  Date: 2019/10/18
  Time: 13:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>USERTEXT</title>
    <style type="text/css">

    </style>
  </head>
  <body>
  姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名<input type="text" name="name"><br>
  真实姓名<input type="text" name="trueName"><br>
  卡&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;id<input type="text" name="cardId"><br>
  Email&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="email"><br>
  电&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;话<input type="text" name="telephone"><br>
  QQ帐号&nbsp;&nbsp;<input type="text" name="qqId"><br>
  密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码<input type="text" name="pwd"><br>
  问&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;题<input type="text" name="question"><br>
  答&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;案<input type="text" name="answer"><br>
  状&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;态<input type="text" name="state">
  <button id="adduser">新增</button>
  <button id="deluser">删除</button>
  <button id="updatauser">修改</button>
  <table border="1">
    <thead>
      <tr>
        <th>姓名</th>
        <th>邮箱</th>
        <th>手机号</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody id="tbody">
    </tbody>
  </table>
  <script src="js/jquery-1.11.0.min.js"></script>
  <script type="text/javascript">
    $(function () {
      function get_user() {
        $.ajax({
          type:"post",
          url:"http://localhost:8080/untitled4_Web_exploded/selectuser",
          success:function (res) {
            if (res.code==1){
              var users = res.data;
              users.forEach(function (obj,index) {
                var tr = $("<tr></tr>");
                var td1 = $("<td>"+obj.name+"</td>");
                var td2 = $("<td>"+obj.email+"</td>");
                var td3 = $("<td>"+obj.telephone+"</td>");
                var td4 = $("<td><input type='checkbox' name=18 value=18 data-id='"+obj.id+"' class='removeuser updateuser'><a href='javascript:;' class='check_info' data-id='"+obj.id+"'><button>详情</button></a></td>")
                tr.append(td1).append(td2).append(td3).append(td4).appendTo(tbody);
              })
            }
          }
        })
      }
      get_user();
      $("#adduser").click(function () {
        var name = $("[name='name']").val();
        var trueName = $("[name='trueName']").val();
        var cardId = $("[name='cardId']").val();
        var email = $("[name='email']").val();
        var telephone = $("[name='telephone']").val();
        var qqId = $("[name='qqId']").val();
        var pwd = $("[name='pwd']").val();
        var question = $("[name='question']").val();
        var answer = $("[name='answer']").val();
        var state = $("[name='state']").val();
        $.ajax({
          type:"post",
          url:"http://localhost:8080/untitled4_Web_exploded/adduser",
          data:{"name":name,"trueName":trueName,"cardId":cardId,"email":email,"telephone":telephone,"qqId":qqId,"pwd":pwd,"question":question,"answer":answer,"state":state},
          success:function (res) {
            if(res.code==1){
              var tbody = $("#tbody");
              var tr = $("<tr></tr>");
              var td1 = $("<td></td>").text(name);
              var td2 = $("<td></td>").text(email);
              var td3 = $("<td></td>").text(telephone);
              var td4 = $("<td><input type='checkbox' name=18 value=18><a>详情</a></td>")
              tr.append(td1).append(td2).append(td3).append(td4).appendTo(tbody);
              alert(res.message)
            }else {
              alert(res.message)
            }
          }
        })
      })
      $("#deluser").click(function () {
        var flag =confirm("您确定要删除吗?");
        if (flag==true){
          var ids ="";
          $(".removeuser").each(function (obj) {
            if ($(this).is(":checked")){
              ids+=$(this).attr("data-id")+",";
            }
          });
          ids = ids.substring(0,ids.length-1);
          $.ajax({
            type:"post",
            url:"http://localhost:8080/untitled4_Web_exploded/deleteuser",
            data:{"id":ids},
            success:function (res) {
              if (res.code==1){
                alert(res.message);
                location.reload();
              }else{
                alert(res.message);
              }
            }
          })
        }
      });
      $("#updatauser").click(function () {
        var ids = "";
        $(".updateuser").each(function (obj) {
          if ($(this).is(":checked")) {
            ids += $(this).attr("data-id") + ",";
          }
        });
        ids = ids.substring(0, ids.length - 1);
        var name = $("[name='name']").val();
        var trueName = $("[name='trueName']").val();
        var cardId = $("[name='cardId']").val();
        var email = $("[name='email']").val();
        var telephone = $("[name='telephone']").val();
        var qqId = $("[name='qqId']").val();
        var pwd = $("[name='pwd']").val();
        var question = $("[name='question']").val();
        var answer = $("[name='answer']").val();
        var state = $("[name='state']").val();
        $.ajax({
          type: "post",
          url: "http://localhost:8080/untitled4_Web_exploded/updatauser",
          data: {
            "name": name,
            "trueName": trueName,
            "cardId": cardId,
            "email": email,
            "telephone": telephone,
            "qqId": qqId,
            "pwd": pwd,
            "question": question,
            "answer": answer,
            "state": state,
            "id": ids
          },
          success: function (res) {
            if (res.code == 1) {
              var tbody = $("#tbody");
              var tr = $("<tr></tr>");
              var td1 = $("<td></td>").text(name);
              var td2 = $("<td></td>").text(email);
              var td3 = $("<td></td>").text(telephone);
              tr.append(td1).append(td2).append(td3).appendTo(tbody);
              alert(res.message);
              location.reload();
            } else {
              alert(res.message);
            }
          }
        })
      });
      $(document).on("click",".check_info",function () {
        //获取当前被点击元素的属性里的id
        var id = $(this).data("id");
        //将id值存入前台的缓存中
        sessionStorage.setItem("id",id);
        //跳转页面
        location.href="usercontent.html";
      });
    })
  </script>
  </body>
</html>
